<template>
	<view class="flex-col-xc">
		<view class="title-bg flex-row-yc">
			<view @click="back" class="item-icon"><u-icon name="arrow-left" color="#fff"></u-icon></view>
			<view class="flex1 text">出勤管理</view>
		</view>

		<view class="flex-row-yc item" @click="goLeaveRequestPage()">
			<view class="flex1">
				请假
			</view>
			<view class="item-icon"><u-icon name="arrow-right" color="#76a2d3"></u-icon>
			</view>
		</view>

		<view class="flex-row-yc item" @click="goLeaveRecordPage()">
			<view class="flex1">请假记录</view>
			<view>27</view>
			<view class="item-icon"><u-icon name="arrow-right" color="#76a2d3"></u-icon></view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			goLeaveRequestPage() {
				uni.navigateTo({
					url: '/pages/attendance/leave-request'
				});
			},
			goLeaveRecordPage() {
				uni.navigateTo({
					url: '/pages/attendance/leave-record'
				});
			},
			back() {
				uni.navigateBack({
					delta: 1
				});
			},
		}
	}
</script>

<style lang="scss" scoped>
	.uni-page-body,
	html,
	body,
	.page {
		width: 100%;
		height: 100%;
	}
	.title-bg {
		width: 100%;
		padding: 0 10px;
		height: 65px;
		background: linear-gradient(-90deg, #3C88D8 0%, #7CAFE7 100%);


		.text {
			color: #FFFFFF;
			font-size: 16px;
			font-weight: 600;
			margin-left: 10px;
		}
	}
	.item{
		width: 100%;
		margin-top: 10px;
		background-color: white;
		height: 45px;
		padding: 0 10px;
	}
</style>